<template>
	<div class="resaleAudiList content-wrap">
		<div class="content-top-box">
			<!-- 搜索区域 -->
			<ul class="search-container">
				<li>
					<span class="search-item-name">添加标的时间：</span>
					<el-date-picker v-model="payDate" type="daterange" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" value-format="yyyy-MM-dd HH:mm:ss" @change="changePayDate">
					</el-date-picker>
				</li>
				<li>
					<span class="search-item-name">名称：</span>
					<el-select v-model="name" placeholder="请选择" clearable @change="changeNameType">
						<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
						</el-option>
					</el-select>
				</li>
				<li>
					<el-button class="search-btn" type="primary" icon="el-icon-search" @click="searchFn" v-if="searchBtn">查询</el-button>
					<el-button class="search-btn" type="primary" icon="el-icon-plus" @click="addFun" v-if="addBtn">新增</el-button>
				</li>
			</ul>
		</div>

		<div class="content-bottom-box">
			<!-- 表格 -->
			<div class="content-form-box">
				<el-table v-loading="loadingFlag" :data="tableData" :height="tableHeight" ref="table" border stripe style="width: 100%">
					<el-table-column prop="serialNumber" label="序号" width="50" fixed>
					</el-table-column>
					<el-table-column prop="productName" label="名称" width="180" fixed>
					</el-table-column>
					<el-table-column prop="totalPrice" label="整牛单价(元/头)" width="200">
					</el-table-column>
					<el-table-column prop="productWeight" label="整牛重量(kg/头)" width="140">
					</el-table-column>
					<el-table-column prop="salesPrice" label="单价(元/kg)" width="140">
					</el-table-column>
					<el-table-column prop="numSaves" label="存货数量(头)" width="140">
					</el-table-column>
					<el-table-column prop="cattleIdCard" label="耳标号" width="120" :show-overflow-tooltip="true">
					</el-table-column>
					<!--<el-table-column label="耳标号">
						<template slot-scope="scope">
							<el-button @click="erbiao(scope.row)" type="text" size="small">【查看】</el-button>
						</template>
					</el-table-column>-->
					<el-table-column prop="timeLimit" label="养殖期" width="110">
						<template slot-scope="scope">
							<span>{{scope.row.timeLimit}}{{scope.row.timeType}}</span>
						</template>
					</el-table-column>
					<el-table-column prop="minDeliveryTime" label="剩余交货期" width="120" :show-overflow-tooltip="true">
						<template slot-scope="scope">
							{{scope.row.minDeliveryTime}}
						</template>
					</el-table-column>
					<el-table-column prop="originCity" label="养殖地区" width="120">
					</el-table-column>
					<el-table-column prop="farmName" label="养殖牧场" width="120">
					</el-table-column>
					<el-table-column prop="largePic" label="牛/牧场图片" width="120">
						<template slot-scope="scope">
							<el-button @click="checkImgFn(scope.row.largePic)" type="text" size="small">【查看】</el-button>
						</template>
					</el-table-column>
					<el-table-column prop="pasturePhoto" label="牧场介绍图片 " width="130">
						<template slot-scope="scope">
							<el-button @click="checkImgFn(scope.row.pasturePhoto)" type="text" size="small">【查看】</el-button>
						</template>
					</el-table-column>
					<el-table-column prop="videoUrl" label="牧场直播链接URL" width="170">
					</el-table-column>
					<el-table-column prop="introductionPhoto" label="牛只保险图片" width="130">
						<template slot-scope="scope">
							<el-button @click="checkImgFn(scope.row.introductionPhoto)" type="text" size="small">【查看】</el-button>
						</template>
					</el-table-column>
					<el-table-column prop="createTime" label="添加标的时间" width="170">
					</el-table-column>
					<el-table-column label="操作" width="120" fixed="right" class-name="ccc">
						<template slot-scope="scope">
							<!--<el-button @click="showDialog(scope.row)" type="text" size="small">重新上架</el-button>-->
							<el-button @click="editRow(scope.row)" type="text" size="small" v-if="scope.row.outMark == 1 && editBtn">编辑</el-button>
							<el-button @click="editRow(scope.row)" type="text" size="small" disabled v-else-if="scope.row.outMark == 2 &&editBtn">编辑</el-button>
							<el-button @click="isOutMark(scope.row)" type="text" size="small" v-if="scope.row.outMark == 1 && closeBtn">关闭</el-button>
							<el-button type="text" size="small" disabled v-else>已关闭</el-button>
						</template>
					</el-table-column>
				</el-table>
			</div>

			<!-- 页码 -->
			<div class="content-Page-container">
				<BaseFormPage :pagination="pagination" @cFirstPageFn="cFirstPageFn" @cLastPageFn="cLastPageFn" @cJumpPageFn="cJumpPageFn" @cPreFn="cPreFn" @cNextFn="cNextFn" @cRefreshFn="cRefreshFn">
				</BaseFormPage>
			</div>
			
			<!-- 查看图片 -->
	        <el-dialog
	            title="查看图片"
	            :visible.sync="imgDialogFlag"
	            center
	            class="banner-check-wrap">
	            <div class="demo-image__error">
	                <div class="block">
	                	<img :src="imgSrc" alt=""  v-if="imgSrc !== '' || imgSrc !== null" style="width: 100%;"/>
	                    <!--<el-image :src="imgSrc" v-if="imgSrc !== '' || imgSrc !== null"></el-image>-->
	                </div>
	            </div>
	        </el-dialog>

			<!-- 耳标弹框 -->
			<el-dialog title="牛耳标ID" :visible.sync="erbiaoFlag" :show-close="false" width="382px">
				<div class="erbiao-content">
					<p class="erbiao-subtitle">耳标信息</p>
					<p class="erbiao-info">
						{{erbiaos}}
					</p>
					<div class="dialog-btn">
						<el-button type="primary" size="medium" @click="erbiaoFlag = false">关闭</el-button>
					</div>
				</div>
			</el-dialog>

			<!-- 下架设置 -->
			<el-dialog title="下架设置" :visible.sync="dialogVisible" width="527px" :show-close="false" center>
				<div class="dialog-wrap">
					<p class="title">审核信息</p>
					<ul class="dialogList">
						<li>
							<span class="left">名称</span>
							<span class="right">安格斯育肥牛</span>
						</li>
						<li>
							<span class="left">整牛单价(元/头)</span>
							<span class="right">12321</span>
						</li>
						<li>
							<span class="left">整牛重量(kg/头)</span>
							<span class="right">2019-9-21</span>
						</li>
						<li>
							<span class="left">单价(元/kg)</span>
							<span class="right">31</span>
						</li>
						<li>
							<span class="left">存货量(头)</span>
							<span class="right">20150</span>
						</li>
						<li>
							<span class="left">养殖期</span>
							<span class="right">650</span>
						</li>
						<li>
							<span class="left">剩余交货期</span>
							<span class="right">10个月</span>
						</li>
						<li>
							<span class="left">养殖地区</span>
							<span class="right">3</span>
						</li>
						<li>
							<span class="left">养殖牧场</span>
							<span class="right er-biao">2</span>
						</li>
						<li>
							<span class="left">添加标的时间</span>
							<span class="right er-biao">2</span>
						</li>
					</ul>
					<span slot="footer" class="dialog-footer">
						<el-button @click="cancelDialog">取 消</el-button>
						<el-button type="primary" @click="keepDialog">下架</el-button>
					</span>
				</div>
			</el-dialog>

			<!-- 新增/编辑 -->
			<el-dialog :title="isAddName" :close-on-press-escape="false" :visible.sync="editRowShow" width="1086px" :show-close="false" :close-on-click-modal="false" center>
				<div class="edit-wrap">
					<p class="edit-title">牛标的{{isAddName}}</p>
					<div class="edit-row">
						<el-form :rules="rules" ref="ruleForm" label-position="right" label-width="140px" :model="isAddData">
							<el-row :gutter="20">
								<el-col :span="8">
									<div class="edit-innerbox">
										<el-form-item label="名称" prop="productName">
											<el-input v-model="isAddData.productName" maxlength="20"></el-input>
										</el-form-item>
										<el-form-item label="整牛单价（元/头）" prop="totalPrice">
											<el-input type="number" min="1" v-model="isAddData.totalPrice" oninput="if(value.length>10)value=value.slice(0,10)"></el-input>
										</el-form-item>
										<el-form-item label="整牛重量（kg/头）" prop="productWeight">
											<el-input type="number" min="1" v-model="isAddData.productWeight" oninput="if(value.length>10)value=value.slice(0,10)"></el-input>
										</el-form-item>
										<el-form-item label="单价（元/kg）" prop="salesPrice">
											<el-input type="number" min="1" v-model="isAddData.salesPrice" oninput="if(value.length>10)value=value.slice(0,10)"></el-input>
										</el-form-item>
										<el-form-item label="牧场直播链接URL" prop="videoUrl">
											<el-input v-model="isAddData.videoUrl"></el-input>
										</el-form-item>
									</div>
								</el-col>
								<el-col :span="8">
									<div class="edit-innerbox">
										<el-form-item label="养殖地区" prop="originCity">
											<el-input v-model="isAddData.originCity" maxlength="20"></el-input>
										</el-form-item>
										<el-form-item label="养殖牧场" prop="farmName">
											<el-input v-model="isAddData.farmName" maxlength="20"></el-input>
										</el-form-item>
										<el-form-item label="养殖期(个月)" prop="timeLimit">
											<el-input type="number" min="1" v-model="isAddData.timeLimit" oninput="if(value.length>10)value=value.slice(0,10)"></el-input>
										</el-form-item>
										<el-form-item label="剩余交货期(个月)" prop="minDeliveryTime">
											<el-input type="number" min="1" v-model="isAddData.minDeliveryTime" oninput="if(value.length>10)value=value.slice(0,10)"></el-input>
										</el-form-item>
										
										<el-form-item label="视频来源" prop="videoSource">
											<el-input v-model="isAddData.videoSource"></el-input>
										</el-form-item>
									</div>
								</el-col>
								<el-col :span="8">
									<div class="edit-innerbox">
										<el-form-item label="存货(头)" prop="numSaves">
											<el-input type="number" min="1" :disabled="isDisabled" v-model="isAddData.numSaves" oninput="if(value.length>10)value=value.slice(0,10)"></el-input>
										</el-form-item>
										<el-form-item label="耳标号" prop="cattleIdCard">
											<el-input type="textarea" :disabled="isDisabled" v-model="isAddData.cattleIdCard"></el-input>
										</el-form-item>
									</div>
								</el-col>
							</el-row>
							<div class="upload-box">
								<div class="upload-imgbox">
									<div class="upload-btnbox">
										<div class="dialog-wrap-right">
						                    <div class="img-box">
						                        <i class="el-icon-picture-outline" v-if="!isAddData.largePic"></i>
						                        <img :src="isAddData.largePic" alt="" @click="checkImgFn(isAddData.largePic)" style="width: 100%">
						                    </div>
						                    <el-upload
						                        class="upload-demo"
						                        ref="uploadImg"
						                        action="http://cs.umubao.com/ymfarm-1.0-SNAPSHOT/api/common/uploadFile"
						                        :on-success="uploadSuccess1"
						                        :before-upload="beforeUpload"
						                        :before-remove="beforeRemove"
						                        multiple
						                        name="multipartFile"
						                        :limit="1"
						                        :on-exceed="limitExceed"
						                        :on-remove="onRemove1">
						                        <el-button size="small" type="success">牧场图片上传</el-button>
						                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过2M</div>
						                    </el-upload>
						                </div>
									</div>
								</div>
								<div class="upload-imgbox">
									<div class="upload-btnbox">
										<div class="dialog-wrap-right">
						                    <div class="img-box">
						                        <i class="el-icon-picture-outline" v-if="!isAddData.pasturePhoto"></i>
						                        <img :src="isAddData.pasturePhoto" alt="" @click="checkImgFn(isAddData.pasturePhoto)" style="width: 100%">
						                    </div>
						                    <el-upload
						                        class="upload-demo"
						                        ref="uploadImg2"
						                        action="http://cs.umubao.com/ymfarm-1.0-SNAPSHOT/api/common/uploadFile"
						                        :on-success="uploadSuccess2"
						                        :before-upload="beforeUpload"
						                        :before-remove="beforeRemove"
						                        multiple
						                        name="multipartFile"
						                        :limit="1"
						                        :on-exceed="limitExceed"
						                        :on-remove="onRemove2">
						                        <el-button size="small" type="success">牧场介绍图片上传</el-button>
						                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过2M</div>
						                    </el-upload>
						                </div>
									</div>
								</div>
								<div class="upload-imgbox">
									<div class="upload-btnbox">
										<div class="dialog-wrap-right">
						                    <div class="img-box">
						                        <i class="el-icon-picture-outline" v-if="!isAddData.introductionPhoto"></i>
						                        <img :src="isAddData.introductionPhoto" alt="" @click="checkImgFn(isAddData.introductionPhoto)" style="width: 100%">
						                    </div>
						                    <el-upload
						                        class="upload-demo"
						                        ref="uploadImg3"
						                        action="http://cs.umubao.com/ymfarm-1.0-SNAPSHOT/api/common/uploadFile"
						                        :on-success="uploadSuccess3"
						                        :before-upload="beforeUpload"
						                        :before-remove="beforeRemove"
						                        multiple
						                        name="multipartFile"
						                        :limit="1"
						                        :on-exceed="limitExceed"
						                        :on-remove="onRemove3">
						                        <el-button size="small" type="success">牛只保险图片上传</el-button>
						                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过2M</div>
						                    </el-upload>
						                </div>
									</div>
								</div>
							</div>
						</el-form>
					</div>
					<div class="edit-footer">
						<div slot="footer">
							<el-button @click="cancelEdit('ruleForm')">取 消</el-button>
							<el-button type="primary" @click="keep('ruleForm')">确认</el-button>
						</div>
					</div>
				</div>
			</el-dialog>
			<!--关闭 -->
			<el-dialog :title="outMark" :visible.sync="dialogHide" width="527px" :show-close="false" :close-on-click-modal="false" :close-on-press-escape="false" center>
				<div class="dialog-wrap">
					<p class="title">您是否要关闭此安格斯育肥牛标的？</p>
					<ul class="dialogList">
						<li>
							<span class="left">名称</span>
							<span class="right">{{detailData.productName}}</span>
						</li>
						<li>
							<span class="left">整牛单价(元/头)</span>
							<span class="right">{{detailData.totalPrice}}</span>
						</li>
						<li>
							<span class="left">整牛重量(kg/头)</span>
							<span class="right">{{detailData.productWeight}}</span>
						</li>
						<li>
							<span class="left">单价(元/kg)</span>
							<span class="right">{{detailData.salesPrice}}</span>
						</li>
						<li>
							<span class="left">存货量(头)</span>
							<span class="right">{{detailData.numSaves}}</span>
						</li>
						<li>
							<span class="left">养殖期</span>
							<span class="right">{{detailData.timeLimit}}个月</span>
						</li>
						<li>
							<span class="left">剩余交货期</span>
							<span class="right">{{detailData.minDeliveryTime}}</span>
						</li>
						<li>
							<span class="left">养殖地区</span>
							<span class="right">{{detailData.originCity}}</span>
						</li>
						<li>
							<span class="left">养殖牧场</span>
							<span class="right er-biao">{{detailData.farmName}}</span>
						</li>
						<li>
							<span class="left">添加标的时间</span>
							<span class="right er-biao">{{detailData.createTime}}</span>
						</li>
					</ul>
					<span slot="footer" class="dialog-footer">
						<el-button @click="HideAction">取 消</el-button>
						<el-button type="primary" @click="closeDialog">关闭</el-button>
					</span>
				</div>
			</el-dialog>
		</div>
	</div>
</template>

<script>
	import Storage from "@/utils/storage";
	import BaseFormPage from '@/components/BaseFormPage';
	export default {
		components: {
			BaseFormPage
		},
		inject: ['reload'],
		data() {
			return {
				isDisabled: false,
				isAddData: {
					name: '',
					cattleIdCard: '',    //身份标识（耳标号）
					productName: '',    // 	名称
					numSaves: '',      // 剩余数量(存货数量)
					timeLimit: '',  	//养殖交割周期
					originCity: '',		// 	发源地市（养殖地区）
					minDeliveryTime: '',  // 剩余交货期
					farmName: '',		// 牧场名称(养殖牧场)
					totalPrice: '',		//		商品价格
					productWeight: '',	//  	商品重量 整牛重量kg/头
					salesPrice: '',		//   散称价格
					largePic: '',		//   	商品大图
					smallPic: '',		//	小图
					productCategory: 1,	//  商品类别 1：牧场商品 2：转售商品
					productCarcass: '',	//		牛胴体
					pasturePhoto: '',		//		牧场图片
					introductionPhoto: '',		//  介绍图片
					videoUrl: '',			//		牧场直播接URL
					videoSource: ''			//  	视频来源
				},
				isEditFlag: false,
				largePic: '',   // 牧场图片
				introductionPic: '',  // 介绍图
				isAddName: '',
				outMark: '关闭',
				dialogHide: false,
				imgDialogFlag: false,
				imgSrc: '',
				dialogVisible: false, // 审核框
				loadingFlag: false, //表格数据加载状态
				startCreateTime: '',
				endCreateTime: '',
				name: '',
				erbiaoFlag: false, // 耳标弹窗
				editRowShow: false,
				erbiaos: '',
				options: [{
					value: '安格斯育肥牛',
					label: '安格斯育肥牛'
				}, {
					value: '牛犊',
					label: '牛犊'
				}],
				payDate: '',
				pageIndex: 1,
				pageSize: 20,
				tableHeight: 200, //表格初始高度
				tableData: [], //表格数据
				pagination: { //分页数据
					loadingFlag: false, //数据加载状态
					currentPage: 1, //当前页
					totalPage: 1, //总页数
					totalNum: 0, //总条数
					firstNum: 0, //分页显示起始值
					endNum: 0 //分页显示结束值
				},
				detailData: {
					
				},
				detailId: '',
				postData: {
					id: '',
					mark: 2,
				},
				rules: {
	                productName: [
	                    { required: true, message: '请输入名称', trigger: 'blur' }
	                ],
	                totalPrice: [
	                 	{ required: true, message: '请输入整牛单价', trigger: 'blur' }
	                ],
	                productWeight:[
	                	{ required: true, message: '请输入整牛重量', trigger: 'blur' }
	                ],
	                salesPrice: [
	                	{ required: true, message: '请输入单价', trigger: 'blur' }
	                ],
	                videoUrl: [
	                	{ required: true, message: '请输入牧场直播接URL', trigger: 'blur' }	
	                ],
	                originCity: [
	               		{ required: true, message: '请输入养殖地区', trigger: 'blur' }	
	                ],
	                farmName: [
	               		{ required: true, message: '请输入养殖牧场', trigger: 'blur' }	
	                ],
	                timeLimit: [
	               		{ required: true, message: '请输入养殖期', trigger: 'blur' }	
	                ],
	                minDeliveryTime: [
	               		{ required: true, message: '请输入剩余交货期', trigger: 'blur' }	
	                ],
	                videoSource: [
	               		{ required: true, message: '请输入视频来源', trigger: 'blur' }	
	                ],
	                numSaves: [
	                	{ required: true, message: '请输入存货数量', trigger: 'blur' }
	                ],
	                cattleIdCard: [
	               		{ required: true, message: '请输入耳标号', trigger: 'blur' }	
	                ]
            	},
				searchBtn: (JSON.parse(Storage.get('roleAuthIdArr'))).indexOf(258) == -1 ? false : true,
				addBtn: (JSON.parse(Storage.get('roleAuthIdArr'))).indexOf(259) == -1 ? false : true,
				editBtn: (JSON.parse(Storage.get('roleAuthIdArr'))).indexOf(260) == -1 ? false : true,
				closeBtn: (JSON.parse(Storage.get('roleAuthIdArr'))).indexOf(261) == -1 ? false : true,
			}
		},
		created() {
			this.getListData();
		},
		methods: {
			// 取消
			HideAction(){
				this.dialogHide = false;
			},
			// 关闭
			closeDialog(){
				this.$http.get('/projectManagement/cattleCardOut', this.postData)
				.then((res)=>{
					console.log(res)
					if(res.data == 200){
						this.dialogHide = false;
						this.getListData()				
					}
				})
			},
			checkImgFn(src){  // 查看图片
				console.log(src)
				if(src){
					this.imgSrc = src
				} else {
					this.imgSrc = ''
				}
            	this.imgDialogFlag = true
           },
			getListData() { // 列表
				this.loadingFlag = true;
				this.pagination.loadingFlag = true;
				let params = {
					name: this.name,
					startCreateTime: this.startCreateTime,
					endCreateTime: this.endCreateTime,
					pgCt: this.pageIndex,
					pgSz: this.pageSize
				}
				if(!this.name) {
					delete params.name
				}
				if(!this.startCreateTime) {
					delete params.startCreateTime
				}
				if(!this.endCreateTime) {
					delete params.endCreateTime
				}
				this.$http.get('projectManagement/cattleCardList', params)
					.then((res) => {
						console.log(res.data.records)
						if(res.data.records.length > 0) {
							this.pagination.totalPage = res.data.pages;
							this.pagination.totalNum = res.data.total;
							res.data.records.forEach((item, index) => {
								item.timeType = '个月'
//								if(item.timeType == 1){
//									item.timeLimit = item.timeLimit + '个月'
//								} else if(item.timeType == 2) {
//									item.timeLimit = item.timeLimit + '周'
//								} else if(item.timeType == 3) {
//									item.timeLimit = item.timeLimit + '天'
//								}
	 							//  天转月
	 							item.minDeliveryTime = item.minDeliveryTime/30;   
	 							item.minDeliveryTime = Math.ceil(item.minDeliveryTime) + '个月'
								if(item.releaseTime){
									item.releaseTime = item.releaseTime.replace('T', ' ')
								}
								//列表下标
								item.index = index;

								//列表序号
								item.serialNumber = ((this.pageIndex - 1) * this.pageSize) + (index + 1)
								//无数据处理
								//								item.orderRefNo = item.orderRefNo || '--'
							})
							this.pagination.firstNum = res.data.records[0].serialNumber
							this.pagination.endNum = res.data.records[res.data.records.length - 1].serialNumber
						} else {
							this.pagination.currentPage = 1
							this.pagination.totalPage = 1
							this.pagination.totalNum = 0
							this.pagination.firstNum = 0
							this.pagination.endNum = 0
						}
						this.tableData = res.data.records;
					})
					.then(() => {
						if(this.tableData.length !== 0) {
							this.tableHeightFn();
						}
						this.loadingFlag = false;
						this.pagination.loadingFlag = false;
					})

			},
			getDetailData(){
				this.$http.get('/api/projectManagement/cattleCardGet' + this.detailId)
				.then((res)=>{
					console.log(res)
				})
			},
			addFun() { // 新增
				console.log(this.isAddData)
				this.editRowShow = true;
				this.isDisabled = false;
				this.isAddName = '新增';
				delete this.isAddData.id;
				this.resetData() // 重置
			},
			// 确认
			keep(formName) {
				if(Number(this.isAddData.timeLimit) < Number(this.isAddData.minDeliveryTime)){ // 剩余交货期不得大于养殖期
					this.isAddData.minDeliveryTime = '';
					this.isAddData.timeLimit = '';
					this.$message({
				        message: '剩余交货期不得大于养殖期,请重新输入',
				        type: 'warning'
				    });
				}
				    
				console.log(this.isAddData)
				this.$refs[formName].validate((valid)=>{
					if(valid){
						if(!this.isAddData.largePic){
							this.$message.error('请上传牧场图片');
						} else if(!this.isAddData.pasturePhoto){
							this.$message.error('请上传牧场介绍图片');
						}else if(!this.isAddData.introductionPhoto){
							this.$message.error('请上传牛只保险图片');
						} else {
							this.$http.get('/projectManagement/cattleCardAdd', this.isAddData)
								.then((res)=>{
									if(res.data == 200){
										this.$refs.uploadImg.clearFiles();
										this.$refs.uploadImg2.clearFiles();
										this.$refs.uploadImg3.clearFiles();
										this.editRowShow = false;
										this.getListData();
										this.$refs[formName].resetFields();
									}
									console.log(res)
								})	
						}
					}
				})

			},
			// 取消编辑
			cancelEdit(formName) {
				this.isAddData.pasturePhoto = '';
				this.isAddData.introductionPhoto = '';
				this.isAddData.largePic = ''
				this.$refs.uploadImg.clearFiles();
				this.$refs.uploadImg2.clearFiles();
				this.$refs.uploadImg3.clearFiles();
				this.editRowShow = false;
				this.$refs[formName].resetFields();
				this.resetData()
			},
			changeNameType(){ // 选择名称
				this.resetPageIndex()
				this.getListData()
			},
			resetData(){
				this.isAddData.name = ''
				this.isAddData.cattleIdCard = ''
				this.isAddData.productName = ''
				this.isAddData.numSaves = ''
				this.isAddData.timeLimit = ''
				this.isAddData.originCity = ''
				this.isAddData.minDeliveryTime = ''
				this.isAddData.farmName = ''
				this.isAddData.totalPrice = ''
				this.isAddData.productWeight = ''
				this.isAddData.salesPrice = ''
				this.isAddData.largePic = ''
				this.isAddData.pasturePhoto = ''
				this.isAddData.productCategory = ''
				this.isAddData.productCarcass = ''
				this.isAddData.largePic = ''
				this.isAddData.introductionPhoto = ''
				this.isAddData.videoUrl = ''
				this.isAddData.videoSource = ''
			},
			editRow(row) { // 编辑
				console.log(row)
				this.editRowShow = true;
				this.isDisabled = true;
				this.isAddName = '编辑';
				this.isAddData.id = row.id
				this.isAddData.name = ''
				this.isAddData.cattleIdCard = row.cattleIdCard
				this.isAddData.productName = row.productName
				this.isAddData.numSaves = row.numSaves
				this.isAddData.timeLimit = row.timeLimit
				this.isAddData.originCity = row.originCity
				row.minDeliveryTime = row.minDeliveryTime.replace('个月', ' ') // 去掉个月
				this.isAddData.minDeliveryTime = Number(row.minDeliveryTime)
				this.isAddData.farmName = row.farmName
				this.isAddData.totalPrice = row.totalPrice
				this.isAddData.productWeight = row.productWeight
				this.isAddData.salesPrice = row.salesPrice
				this.isAddData.largePic = row.largePic  
				this.isAddData.pasturePhoto = row.pasturePhoto
				this.isAddData.productCategory = row.productCategory
				this.isAddData.productCarcass = row.productCarcass
				this.isAddData.largePic = row.largePic
				this.isAddData.introductionPhoto = row.introductionPhoto
				this.isAddData.videoUrl = row.videoUrl
				this.isAddData.videoSource = row.videoSource
			},
			erbiao(row) { // 耳标弹出框
				this.erbiaoFlag = true;
				this.erbiaos = row.cattleIdCard;
			},
			changePayDate() {
				if(this.payDate) {
					this.startCreateTime = this.payDate[0]
					this.endCreateTime = this.payDate[1].replace('00:00:00', '23:59:59')
				} else {
					this.startCreateTime = ''
					this.endCreateTime = ''
				}
				this.resetPageIndex()
				this.getListData()
			},
			resetPageIndex() { //重置页码
				this.pagination.currentPage = 1;
				this.pageIndex = 1;
			},
			clearPhoneFn() { //清空手机号
				this.resetPageIndex()
				this.getListData()
			},
			clearUserName() { //清空姓名
				this.resetPageIndex()
				this.getListData()
			},
			searchFn() {
				this.resetPageIndex()
				this.getListData()
			},
			cFirstPageFn(pageNum) { //首页
				this.pageIndex = pageNum;
				this.getListData()
			},
			cLastPageFn(pageNum) { //尾页
				this.pageIndex = pageNum;
				this.getListData()
			},
			cJumpPageFn(pageNum) { //页码跳转
				this.pageIndex = pageNum;
				this.getListData()
			},
			cPreFn(pageNum) { //上一页
				this.pageIndex = pageNum;
				this.getListData()
			},
			cNextFn(pageNum) { //下一页
				this.pageIndex = pageNum;
				this.getListData()
			},
			resetParams() { //重置参数

			},
			cRefreshFn() { //刷新
				this.reload()
			},
			isOutMark(item) { // 关闭点击
				console.log(item)
				this.dialogHide = true;
				this.detailData = item;
				this.postData.id = item.id; // 关闭
			},
			selectState(value) {
				console.log(value)
				this.buyData.state = value;
			},
			showDialog() {
				this.dialogVisible = true;
			},
			cancelDialog() {
				this.dialogVisible = false;
			},
			keepDialog() {

			},
			tableHeightFn() { //表格高度
				let tableDataLength = this.tableData.length;
				let minHeight = tableDataLength == 0 ? 0 : 80; //根据需求距离底部的高度
				this.$nextTick(function() {
					//window.innerHeight:浏览器的可用高度
					//this.$refs.table.$el.offsetTop：表格距离浏览器的高度
					this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - minHeight;
					if(this.tableData.length <= 0) {
						this.tableHeight = '60vh'
					}

					// 通过捕获系统的onresize事件触发去改变原有的高度
					let self = this;
					window.onresize = function() {
						self.tableHeight = window.innerHeight - self.$refs.table.$el.offsetTop - minHeight;
						self.tableHeight = self.tableHeight < 200 ? 200 : self.tableHeight;
					}
				})
			},
			limitExceed(files, fileList) { //图片个数限制
	            this.$message.warning(`当前限制上传 1 个文件，本次选择了 ${files.length} 个文件，若需要更改图片，请删除已上传文件`);
	       },
	        beforeUpload(file) { //图片格式大小限制
	            const isJPG = (file.type === 'image/jpeg' || file.type === 'image/png');
	            const isLt2M = file.size / 1024 / 1024 < 2;
	
	            if (!isJPG) {
	                this.$message.error('上传图片只能是 jpg/png 格式!');
	            }
	            if (!isLt2M) {
	                this.$message.error('上传图片大小不能超过 2MB!');
	            }
	            return isJPG && isLt2M;
	        },
	        beforeRemove(file, fileList) { //移除已上传图片
	            return this.$confirm(`确定移除 ${ file.name }？`);
	        },
	        // 牧场图片
	        onRemove1(img) { //移除图片成功
	        	this.isAddData.largePic = "";
	        },
	        uploadSuccess1(res, file) { //图片上传成功
	            this.isAddData.largePic = res.data.url;
	        },
	        // 牧场介绍图片
	        onRemove2(img) { //移除图片成功
	        	this.isAddData.pasturePhoto = "";
	        },
	        uploadSuccess2(res, file) { //图片上传成功
	            this.isAddData.pasturePhoto = res.data.url;
	        },
	        // 牧场保险图片
	        onRemove3(img) { //移除图片成功
	        	this.isAddData.introductionPhoto = "";
	        },
	        uploadSuccess3(res, file) { //图片上传成功
				console.log(res)
	            this.isAddData.introductionPhoto = res.data.url;
	        },
		},

	}
</script>
<style type="text/css">
	.resaleAudiList .dialog-wrap .el-input__inner,
	.resaleAudiList .dialog-wrap .el-textarea__inner {
		border-color: #fff !important;
	}
	
	.resaleAudiList .dialog-wrap .el-form-item {
		margin-bottom: 0;
	}
	
	.resaleAudiList .dialog-wrap .el-form-item__error {
		z-index: 9;
	}
	.ccc .cell{
		display: flex;
		justify-content: space-between;
		padding: 0 20px;
	}
	.el-tooltip__popper {
	  max-width: 800px;
	}
</style>
<style lang="scss" scoped>
	@import '@/assets/css/dialogDetail.scss';
	.edit-wrap {
		padding: 0 10px;
		.edit-row {
			margin-bottom: 40px;
		}
		.edit-footer {
			display: flex;
			justify-content: space-around;
			.el-button {
				margin-right: 50px;
			}
		}
	}
	
	.upload-box {
		display: flex;
		.upload-imgbox {
			margin-right: 40px;
			text-align: center;
			.upload-top {
				width: 240px;
				height: 147px;
				border: 1px solid #D0CFCF;
				margin-bottom: 24px;
				.el-icon-upload {
					font-size: 50px;
					margin-top: 40px;
				}
			}
			.upload-btnbox {
				.upload-btn {
					display: inline;
					.el-button {
						background-color: #35CC9E;
						border: 1px solid #35CC9E;
					}
				}
			}
		}
	}
	
	.last-oli {
		display: inherit;
		padding-left: 74px;
		position: relative;
		.last-ospan {
			position: absolute;
			left: 0;
			top: 0;
		}
		.last-span2 {
			position: absolute;
			left: 145px;
			top: 0;
		}
	}
	/* 耳标弹出框 */
	
	.erbiao-content {
		padding: 0 20px;
		.erbiao-subtitle {
			color: #344047;
			margin-bottom: 16px;
		}
		.erbiao-info {
			color: #5D6164;
			margin-bottom: 40px;
			padding: 0 30px;
		}
		.dialog-btn {
			text-align: center;
		}
	}
	.banner-check-wrap {
        .el-dialog__body {
            text-align: center;
        }
    }
    
    .dialog-wrap-right {
                width: 224px;
                text-align: center;
                .img-box {
                    width: 224px;
                    height: 138px;
                    border: 1px solid #D0CFCF;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                    i {
                        font-size: 44px;
                        color: #D0CFCF;
                        line-height: 130px;
                    }
                }
                button {
                    margin-top: 24px;
                }
            }
</style>